<!-- 首页 -->
<template>
  <div>
    <zlw-navbar></zlw-navbar>
    <div class="container">
      <el-row :gutter="30">
        <!--              <el-col :sm="24"  :md="6" >-->
        <!--                <zlw-leftlist></zlw-leftlist>-->
        <!--              </el-col>-->
        <el-col :sm="24" :md="16" style="transition:all .5s ease-out;margin-bottom:30px;">
          <zlw-articlelist></zlw-articlelist>
        </el-col>
        <el-col :sm="24" :md="8" style="transition:all .5s ease-out;margin-bottom:30px;">
          <zlw-rightlist></zlw-rightlist>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import header from '../components/header.vue'
import articlelist from '../components/articlelist.vue'
import leftlist from '../components/leftlist.vue'
import rightlist from "../components/rightlist";

export default {
  name: 'Home',
  data() { //选项 / 数据
    return {}
  },
  methods: { //事件处理器

  },
  beforeCreate() {
    if(/(iPhone|iPad|iPod|iOS|Android)/i.test(navigator.userAgent)) {
      //移动端设备
      this.$alert('本系统暂未适配移动端，展示效果不佳，请使用PC端访问~', '提示', {
        confirmButtonText: '确定',
        type:'warning'
      });
    } else {
      //pc端
    }
  },
  components: { //定义组件
    'zlw-navbar': header,
    'zlw-articlelist': articlelist,
    'zlw-leftlist': leftlist,
    'zlw-rightlist': rightlist,
  },
  created() { //生命周期函数

  }
}
</script>

<style>

</style>
